@import './less/global.less';
.layout-main {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 20px;
    z-index: 10;
    .layout-top {
        display: flex;
        flex: 1;
        .layout-left {
            display: flex;
            flex: 4;
            flex-direction: column;
            .layout-title {
                height: auto;
                display: flex;
                color: #25fffc;
                font-size: 60px;
                align-items: center;
                justify-content: center;
            }
            .layout-list-panel {
                flex: 1;
                display: flex;
                flex-direction: column;
                padding: 0 20px;
                overflow-x: hidden;
                overflow-y: hidden;
                .layout-list {
                    display: flex;
                    border: 3px solid #ebdaff;
                    margin: 10px;
                    height: 180px;
                    flex-shrink: 0;
                    background-color: rgba(66, 23, 129, 0.6);
                    box-shadow: 0 0 12px #cb4fff;
                    border-radius: 5px;
                    .head-img {
                        width: 140px;
                        display: flex;
                        flex-direction: column;
                        justify-content: flex-start;
                        padding: 20px;
                        .img {
                            border: 2px solid red;
                            height: 100px;
                            border-radius: 50px;
                            background-size: cover;
                        }
                    }
                    .mid {
                        flex: 1;
                        padding: 10px;
                        .title {
                            font-size: 30px;
                            min-height: 45px;
                            color: #e1a8ff;
                        }
                        .message {
                            font-size: 30px;
                            color: red;
                        }
                    }
                    .time {
                        padding: 0 10px;
                        font-size: 30px;
                        color: #e1a8ff;
                    }
                }
            }
        }
        .layout-right {
            display: flex;
            flex: 1;
            flex-direction: column;
            .layout-img {
                display: flex;
                flex: 2;
            }
            .layout-ewm {
                display: flex;
                flex: 1;
                margin-top: 20px;
            }
        }
    }
    .layout-bottom {
        display: flex;
        height: 50px;
    }
}